<!--盘点    修改-->
<template>
    <el-dialog title="修改" :visible.sync="dialogVisible">
        <el-form ref="inventoryForm" :model="inventoryForm" :rules="inventoryRules" label-width="110px">
            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="盘点日期:" prop="countDate">
                        <el-date-picker v-model="inventoryForm.countDate" type="date" placeholder="选择日期"
                                        value-format="yyyy-MM-dd" style="width: 100%">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <!--                <el-col :span="12">-->
                <!--                    <el-form-item label="存货编码:" prop="code">-->
                <!--                        <el-input v-model="inventoryForm.code" placeholder="存货编码" :disabled="true"-->
                <!--                                  v-if="inventoryForm.id"/>-->
                <!--                        <el-input v-else v-model="inventoryForm.code" placeholder="存货编码"/>-->
                <!--                    </el-form-item>-->
                <!--                </el-col>-->
                <el-col :span="12">
                    <el-form-item label="类别:" prop="dictCategory">
                        <!--                        <CategoryCascader @selectValue="selectValue" ref="categoryRef"-->
                        <!--                                          v-model="inventoryForm.category"-->
                        <!--                                          :inventoryFormId="inventoryForm.id"></CategoryCascader>-->
                        <el-input v-model="inventoryForm.dictCategory" placeholder="类别" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="存货名称:" prop="name">
                        <!--                        <el-input v-model="inventoryForm.name" placeholder="存货名称" v-if="inventoryForm.id"-->
                        <!--                                  :disabled="true"/>-->
                        <el-input v-model="inventoryForm.name" placeholder="存货名称" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="规格型号:" prop="model">
                        <el-input v-model="inventoryForm.model" placeholder="规格型号" :disabled="true"/>
                        <!--                        <VagueInput v-model="inventoryForm.specifications" @inputValue="inputValue"-->
                        <!--                                    :inventoryFormId="inventoryForm.id"></VagueInput>-->
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="计量单位:" prop="unit">
                        <el-input v-model="inventoryForm.unit" placeholder="计量单位" :disabled="true"/>
                        <!--                        <UnitSelect @selectValues="selectValues" ref="unitRef"-->
                        <!--                                    v-model="inventoryForm.unit" :inventoryFormId="inventoryForm.id"></UnitSelect>-->
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="数量差异:" prop="quantity">
                        <el-input v-model="inventoryForm.quantity" placeholder="数量" type="number"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="单价:" prop="unitFee">
                        <!--                        <el-input v-model="inventoryForm.unitFee" placeholder="单价" v-if="inventoryForm.id"-->
                        <!--                                  :disabled="true"/>-->
                        <el-input v-model="inventoryForm.unitFee" placeholder="单价" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="金额:" prop="totalFee">
                        <!--                        <el-input v-model="inventoryForm.outbound" placeholder="金额" v-if="inventoryForm.id"-->
                        <!--                                  :disabled="true"/>-->
                        <!--                        <el-input v-model="inventoryForm.totalFee" placeholder="金额" :disabled="true"/>-->
                        {{ inventoryForm.quantity * inventoryForm.unitFee }}
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="备注:" prop="remark">
                        <!--                        <el-input type="textarea" :rows="2" v-model="inventoryForm.inventoryAlert" placeholder="备注"-->
                        <!--                                  v-if="inventoryForm.id" :disabled="true"/>-->
                        <el-input type="textarea" :rows="2" v-model="inventoryForm.remark" placeholder="备注"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="submitForm('inventoryForm')">保存</el-button>
        </span>
    </el-dialog>
</template>

<script>
import CategoryCascader from './categoryCascader.vue'
import UnitSelect from './unitSelect.vue'
import VagueInput from './vagueInput.vue'

export default {
    components: {
        CategoryCascader,
        UnitSelect,
        VagueInput
    },
    data() {
        return {
            dialogVisible: false,
            inventoryForm: {
                id: '',
                countDate: '',
                workshop: '',
                code: '',
                dictCategory: '',
                name: '',
                model: '',
                unit: '',
                quantity: '',
                unitFee: '',
                totalFee: '',
                num: '',
                remark: '',
                position: ''
            },
            inventoryRules: {
                countDate: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                code: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                // dictCategory: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // name: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // specifications: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // unit: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                quantity: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                // warehousing: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // outbound: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                num: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                position: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                inventoryAlert: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ]
            }
        }
    },
    mounted() {
    },
    methods: {
        // // 规格型号勾选的值
        // inputValue(value) {
        //     this.inventoryForm.specifications = value
        // },
        // // 类别勾选的值
        // selectValue(value) {
        //     this.inventoryForm.category = value
        // },
        // // 计量单位勾选值
        // selectValues(value) {
        //     this.inventoryForm.unit = value
        // },
        // 新增接口----------------
        submitForm(formName) {
            //当全部验证字段通过，再开始业务逻辑
            this.$refs[formName].validate((valid) => {
                //如果全部字段符合条件
                if (valid) {
                    this.inventoryForm.totalFee = this.inventoryForm.quantity * this.inventoryForm.unitFee
                    this.$http.put(`/stock/stockcount`, this.inventoryForm).then(({data: res}) => {
                        if (res.code !== 0) {
                            return this.$message.error(res.msg);
                        }
                        this.$message({
                            message: '恭喜你，操作成功',
                            type: 'success'
                        });
                        this.dialogVisible = false
                        this.$emit('updateViews');
                    })
                } else {
                    this.$message({
                        message: '必填项不能为空',
                        type: 'info'
                    });
                    return false;
                }
            });
        }
    }
}
</script>

<style scoped>
.el-col {
    margin-bottom: 3px;
}
</style>